$(function () {
    /*头部导航*/
    $("#head-nav5").children(".drop-nav").show();
    $("#head-nav5_1").addClass("active");

    // banner
    var swiper = new Swiper('#town-banner', {
      spaceBetween: 0,
      centeredSlides: true,
      keyboard: {
        enabled: true,
      },
      /*autoplay: {
        delay: 2500,
        disableOnInteraction: false,
      },*/
      pagination: {
        el: '.swiper-pagination',
        clickable: true,
      }
    });

    var townFeaSwiper = new Swiper('#town-feature', {
        freeMode: true,
        slidesPerView: 'auto',
        freeModeSticky: true,
    });
    var townPlanSwiper = new Swiper('#town-plan', {
        freeMode: true,
        slidesPerView: 'auto',
        freeModeSticky: true,
    });
    var townCaseSwiper = new Swiper('#town-case', {
        freeMode: true,
        slidesPerView: 'auto',
        freeModeSticky: true,
    });
    var townDynamicSwiper = new Swiper('#town-dynamic', {
        freeMode: true,
        slidesPerView: 'auto',
        freeModeSticky: true,
    });

    /*精彩动态图片点击放大效果*/
    $(".town-dynamic li").click(function () {
        $("#tk-slide,.tk-bg").fadeIn(300);
        $('body').css("overflow", "hidden");
        var memeryImageSetId = $(this).children('img').data('setid');
        $.ajax({
            url: "/albumPhotos",
            data: {
                subType: memeryImageSetId,
                photoType: 1
            },
            type: "get",
            success: function (res) {
                var images = JSON.parse(res).data;
                var html = '<section id="section-header" data-coloroverlap="dark"></section>\
                            <div id="character-slider" class="sky-carousel sc-no-select">\
                                <div class="close-btn"></div>\
                                <div class="sky-carousel-wrapper">\
                                    <ul class="sky-carousel-container" id="memeryImgSet">\
                                    </ul>\
                                </div>\
                            </div>';
                $('#tk-slide').append(html);

                for (img in images) {
                    var imgHtml = '<li><img src="' + images[img].url + '" class="sc-image"></li>';
                    $('#memeryImgSet').append(imgHtml);
                }
                /*图片旋转木马特效*/
                buildSideNav();
                skyCarousel = $('#character-slider').carousel({
                    itemWidth: 310,
                    itemHeight: 220,
                    enableMouseWheel: false,
                    gradientOverlayVisible: true,
                    gradientOverlayColor: '#F0F3EE',
                    gradientOverlaySize: 200,
                    distance: 10,
                    selectedItemDistance: 10,
                    selectByClick: true,
                    selectedItemZoomFactor: 0.8,
                    unselectedItemZoomFactor: 0.8,
                    navigationButtonsVisible: false,
                    showPreloader: false,
                    autoSlideshow: false
                });

                $(".tk-bg,.close-btn").click(function () {
                    $('#tk-slide').empty();
                    $(".tk-bg, #tk-slide").fadeOut(300);
                    $('body').css("overflow", "auto");
                    return;
                });
            }
        });
    });
    $(".tk-bg,.close-btn").click(function () {
        $(".tk-bg, #tk-slide").fadeOut(300);
        return;
    });
});
